<!DOCTYPE html>
<html>

<head>
    <title>Animation keyframes</title>
    <meta charset=utf-8>
    <meta name=description content="batch creation of keyframe animations">
    <meta name=viewport content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/animationframes.css">
</head>

<body>
    <div id="content">
        <ul>
            <li class="box slidein"><div class="box-inner"></div>
            </li><li class="box slideout"><div class="box-inner"></div>
            </li><li class="box marquee"><div class="box-inner"></div>
            </li><li class="box fadein"><div class="box-inner"></div>
            </li><li class="box fadeout"><div class="box-inner"></div>
            </li><li class="box colorfade"><div class="box-inner"></div>
            </li><li class="box rainbow"><div class="box-inner"></div>
            </li><li class="box blink"><div class="box-inner"></div>
            </li><li class="box flicker"><div class="box-inner"></div>
            </li><li class="box fadein-grow"><div class="box-inner"></div>
            </li><li class="box fadeout-shrink"><div class="box-inner"></div>
            </li><li class="box grow"><div class="box-inner"></div>
            </li><li class="box shrink"><div class="box-inner"></div>
            </li><li class="box drop"><div class="box-inner"></div>
            </li><li class="box rise"><div class="box-inner"></div>
            </li><li class="box bounce-x"><div class="box-inner"></div>
            </li><li class="box bounce-y"><div class="box-inner"></div>
            </li><li class="box bounce-xy"><div class="box-inner"></div>
            </li><li class="box run"><div class="box-inner"></div>
            </li><li class="box cross-run"><div class="box-inner"></div>
            </li><li class="box diamond-run"><div class="box-inner"></div>
            </li><li class="box kaleidoscope-in"><div class="box-inner"></div>
            </li><li class="box kaleidoscope-out"><div class="box-inner"></div>
            </li><li class="box radar"><div class="box-inner"></div></li>
        </ul>
    </div>

</body>

</html>
